.dropdown .btn .text-muted {
  color: $gray-500 !important;
}

.dropdown {
  .arrow {
    color: $gray-300;
  }

  &:hover {
    .arrow {
      color: $gray-500;
    }
  }
}

.dropdown.show {
  .arrow {
    transform: rotate(3.142rad);
  }
}

.dropdown-menu, .dropdown-container {
  margin-top: 0.25rem !important;
  overflow: hidden !important;
  box-shadow: $dropdown-box-shadow;
  border-radius: $dropdown-border-radius;
  box-shadow: $dropdown-box-shadow;
  background-color: $dropdown-bg;
  z-index: $zindex-dropdown;
  min-width: $dropdown-min-width;
  padding: $dropdown-padding-y $dropdown-padding-x;
  font-size: $dropdown-font-size;
  color: $dropdown-color;
  max-width: 20rem;

  .dropdown-item, .dropdown-header {
    padding-top: $dropdown-item-padding-y;
    padding-bottom: $dropdown-item-padding-y;
    padding-left: $dropdown-item-padding-x;
    padding-right: $dropdown-item-padding-x;
  }
  .dropdown-header {
    margin-bottom: 0.25rem;
    margin-top: 0.25rem;
  }

  .dropdown-item {
    margin-bottom: 0.25rem;
    border-radius: $dropdown-inner-border-radius;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: transparent;
    height: 2rem;
    padding-right: 2rem;

    transition-property: background-color, color;
    transition-duration: 0.01s;
    transition-timing-function: ease;

    &:hover {
      background-color: $dropdown-link-hover-bg;
      color: $dropdown-link-hover-color;
    }

    i {
      margin-right: 0.5rem;
    }

    .badge {
      @extend .ml-auto;
      @extend .align-self-center;
    }
    &.btn {
      font-weight: $font-weight-base !important;
    }
    &.btn-danger {
      box-shadow: none;
    }
  }
  .dropdown-item.active {
    color: theme-color('black') !important;

    i {
      color: theme-color('black') !important;
    }

    &::after {
      content: '';
      display: inline-block;
      position: absolute;
      right: 0.75rem;
      width: 1rem;
      height: 1rem;
      background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-check text-primary"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10"/></svg>') no-repeat center center;
    }
  }
  .dropdown-item.active {
    font-weight: 600 !important;
    background-color: $dropdown-link-hover-bg !important;
  }
  .button_to {
    width: 100%;
  }
  .dropdown-header {
    font-weight: $font-weight-base;
    font-size: $font-size-base;
  }

  .dropdown-item:last-child {
    margin-bottom: 0px;
  }
}
// new non-bootstrap dropdowns
.dropdown-container {
  // Position is handled by Floating UI via inline styles
  // Keep position: absolute but let Floating UI set top/left/right/bottom
  position: absolute;
  animation: fadeIn 0.15s ease-in-out;

  // Legacy classes kept for backward compatibility but no longer apply positioning
  // Floating UI handles all positioning automatically
  &.dropdown-container-left {
    // No longer needed - Floating UI handles placement
  }
  &.dropdown-container-top {
    // No longer needed - Floating UI handles placement
  }
}

.dropdown-toggle {
  &:after {
    border: none;
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='icon icon-tabler icons-tabler-outline icon-tabler-chevron-down'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M6 12l6 6l6 -6'/%3E%3C/svg%3E");
    transition: transform 0.2s ease-in-out;
    transform: rotate(0deg);
    opacity: 0.5;
  }
}
.dropdown-toggle:hover {
  &:after {
    opacity: 1;
  }
}
.dropdown-toggle:focus, .dropdown-toggle:active, .dropdown-toggle[aria-expanded="true"] {
  &:after {
    transform: rotate(180deg);
    opacity: 1;
  }
}